<template>
    <div class="child">
        子组件
        <!-- 在模板直接使用 $emit对象触发的事件 -->
        <button @click="$emit('sendmsg', '100')">给父组件通讯</button>
        <button @click="sendMsg">给父组件通讯(在setup中触发事件)</button>

    </div>
</template>

<script setup lang="ts" name='Child'>
import { ref, reactive } from "vue";

//声明可以触发的事件
const emit = defineEmits(['sendmsg'])

function sendMsg() {
    console.log("abcdef");

    emit('sendmsg', '59')
}




</script>

<style scoped>
.child {

    min-height: 100px;
    background-color: rgb(170, 181, 182);
    border-radius: 10px;
    padding: 5px;
    margin: 5px
}
</style>